<template>
  <div>
    <loading v-show="isLoading"></loading>
    <!-- <div  class="comment-box">
      <div id="SOHUCS"></div>
    </div> -->
    <div v-show="!isLoading" class="comment-box">
      <div id="gitalk-container"></div>
    </div>
  </div>
</template>
<script>
import Loading from "./Loading.vue";
export default {
  name: "comment_changyan",
  components: { Loading },
  data() {
    return {
      isLoading: true,
      gitalk: new Gitalk({
        clientID: "f8163c9a8c802fe6ee84", //Client ID
        clientSecret: "b608417a2e84bac3aa20f8563b32230d0033a030", //Client Secret
        repo: "e-procurement-talk", //仓库名称
        owner: "wicking2233", //仓库拥有者
        admin: ["wicking2233"],
        id: decodeURI(location.href), // Ensure uniqueness and length less than 50
        distractionFreeMode: false, // Facebook-like distraction free mode
      }),
    };
  },
  mounted() {
    this.gitalk.render("gitalk-container");
    this.delayFiveSeconds();
  },
  methods: {
    delayFiveSeconds() {
      setTimeout(() => {
        this.isLoading = false;
      }, 3000);
      console.log(this.isLoading);
    },
  },
};
</script>
<style scoped>
.comment-box {
  background: #fff;
  padding: 15px;
  width: 120vh;
  height: auto;
  position: relative;
}
</style>
